<template>
  <div>
    <Header title="地址管理" />
    <van-address-list
        :list="list"
        default-tag-text="默认"
        @add="onAdd"
        @edit="onEdit"
    />
  </div>
</template>

<script>
import Header from "../../components/Header.vue";
export default {
  components: { Header },
  data(){
    return{
      list: [],
    }
  },
  mounted(){
    this.init();
  },
  methods: {

    // 初始化数据
    init(){
      this.list = this.$store.state.userAddress.map((item) => {
        return {
          id: item.id,
          name: item.name,
          tel: item.tel,
          address: `${item.province}${item.city}${item.county}${item.addressDetail}`,
          address: item.province+""+item.city+""+item.county+""+item.addressDetail,
          isDefault: !!item.isDefault,
        };
      });
    },

    // 新增地址的按钮
    onAdd() {
      this.$router.push({
        path: "./addressedit",
        query: {
          type: "add",
        },
      });
    },

    // 编辑地址的按钮
    onEdit(item) {
      this.$router.push({
        path: "./addressedit",
        query: {
          id: item.id,
          type: "change",
        },
      });
    },

  },
};
</script>


<style lang='less' scoped>
/deep/ .van-button--danger {
  background-color: #ffc400;
  border-color: #ffc400;
}
/deep/ .van-switch--on {
  background-color: #ffc400;
}
/deep/ .van-radio__icon {
  display: none;
}
</style>